<!DOCTYPE html>
<html>

<head>

    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
        <title>login</title>
        <link rel="stylesheet" href="css/format.css" />
        <link rel="stylesheet" href="css/mint-min.css" />
        <link rel="stylesheet" href="./component/component.css" />
        <link rel="stylesheet" href="./css/password.css" />
        <link rel="stylesheet" href="./css/turn-in-out.css" />
    </head>
</head>

<body>
    <div id="turn-app">
        <div class="turn-card-info">
            <img src="./img/icon_singlebanlogo.png" class="turn-card-logo" />
            <p class="turn-card-name">
                <span>中原银行储蓄卡<i>(7891)</i></span>
                <span v-if="chineseTitle === '转入'">单笔限额10万元，单日限额10万元</span>
                <span v-else>2小时内到账</span>
            </p>
            <img src="./img/icon_jiantou.png" class="turn-card-more" />
        </div>
        <div class="turn-operation">
            <h3>
                <p v-text="`${chineseTitle}金额(元)`"></p>
                <i v-if="chineseTitle === '转出'">单笔限额50000元</i>
            </h3>
            <div class="turn-input-wrap">
                <label>￥</label>
                <input v-model="money" type="number" @focus="togglePlaceholder()" @blur="togglePlaceholder()" />
                <span v-show="showplaceholder && !money" class="turn-input-placeholder"
                    v-text="`请输入${chineseTitle}金额`"></span>
            </div>
        </div>
        <div class="turn-button-wrap">
            <wide-red-button :title="`确认${chineseTitle}`" :disabled="btnDisabled" @click="btnClick"></wide-red-button>
        </div>
        <div class="trun-inout-backgroundlogo">
            <background-logo src="./img/icon_banlogoblue.svg"></background-logo>
        </div>
        <mt-popup v-model="popupVisible" position="right" modal="true" closeOnClickModal="false">
            <div class="turn-modal-wrap">
                <input ref="pwd" type="tel" maxlength="6" v-model="msg" class="pwd" unselectable="on" />
                <ul class="pwd-wrap" @click="focus">
                    <li :class="msg.length == 0?'psd-blink':''"><i v-if="msg.length > 0"></i></li>
                    <li :class="msg.length == 1?'psd-blink':''"><i v-if="msg.length > 1"></i></li>
                    <li :class="msg.length == 2?'psd-blink':''"><i v-if="msg.length > 2"></i></li>
                    <li :class="msg.length == 3?'psd-blink':''"><i v-if="msg.length > 3"></i></li>
                    <li :class="msg.length == 4?'psd-blink':''"><i v-if="msg.length > 4"></i></li>
                    <li :class="msg.length == 5?'psd-blink':''"><i v-if="msg.length > 5"></i></li>
                </ul>
                <div class="modal-button-wrap">
                    <wide-red-button class="modal-button" title="确认" :disabled="confirmDisabled"
                        @click="modalBtnClick(1)"></wide-red-button>
                    <wide-red-button class="modal-button" title="取消" :disabled="false" @click="modalBtnClick(2)">
                    </wide-red-button>
                </div>
            </div>
        </mt-popup>
    </div>
    <script src="util/vue.min.js"></script>
    <script src="util/rem.js"></script>
    <script type="text/javascript" src="util/mint-min.js"></script>
    <script type="text/javascript" src="./util/util.js"></script>
    <script type="text/javascript" src="./util/regConfig.js"></script>
    <script src="./component/wide-red-button.js"></script>
    <script src="./component/background-logo.js"></script>
    <script src="./js/turn-in-out.js"></script>
</body>

</html>